<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>tab简陋实例</title>
<script src="jquery-1.3.2.js" language="javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
           $(".tab li:first").addClass("current"); //为第一个SPAN添加当前效果样式
           $(".mytab divt1:not(:first)").hide(); //隐藏其它的UL
            $(".tab li").click(function() { 
			
                $(".mytab div").hide();
                $("." + $(this).attr("id")).fadeIn('slow');//注意了，ff是不支持这种特效的！
            });
        });
    </script>
</head>
<body>
<div style="width:100px; height:120px;">
      <div  style="width:100px; height:20px;">
  		<ul class="tab">
        	<li id="divt1" style="cursor:pointer">选项卡1</li>
            <li id="divt2" style="cursor:pointer">选项卡2</li> 
        </ul>
      </div>
     <div class="mytab">
        <div  class="divt1" style=" display:block;width:100px; height:100px; background:#ff0">
  			选项卡1
  		</div>  
        <div  class="divt2" style=" display:none;width:100px; height:100px; background:#f0f">
            选项卡2
        </div>
    </div>
</div>
</body>
</html>
